<template>
  <div id="postList">
    <!-- <div class="post" v-for="(item, index) in postList" :key="index">
      <div class="desc">
        <p class="title" style="font-size: x-large; text-align: left">
          {{ item.title }}
        </p>
        <p class="other" style="font-size: x-small; margin-top: 15px">
          <span style="margin-left: 0px">作者：{{ item.upId }}</span>
          <span style="margin-left: 10px">类型：{{ item.type }}</span>
          <span style="margin-left: 10px">点赞数{{ item.agree }}</span>
        </p>
      </div>
    </div> -->
    <ArticleShow :mypost-flag="flag" :post-list="postList"></ArticleShow>
    <div class="footer"></div>
  </div>
</template>
<script>
import ArticleShow from "@/components/User/Article/ArticleShow";
import { getPersonInfo, getPostByUpId } from "@/utils/api";
export default {
  name: "MyPost",
  props: {
    userInfo: Object,
  },
  components: { ArticleShow },
  data() {
    return {
      flag: true,
      postList: [],
    };
  },
  created() {
    let userId = this.userInfo.userId;
    if (userId) {
      getPostByUpId(userId).then((res) => {
        let postList = res.data.resultMap.postList.list;
        if (postList.length != 0) {
          this.postList = postList;
        }
      });
    }
  },
  watch: {
    userInfo: function () {
      getPostByUpId(this.userInfo.userId).then((res) => {
        this.postList =  res.data.resultMap.postList.list;
      });
    },
  },
};
</script>

<style scoped>
.desc:hover {
  box-shadow: 0px 0px 8px #888888;
  cursor: pointer;
}
.desc {
  padding: 5px;
}
.post {
  margin-top: 20px;
}
.footer {
  margin-top: 100px;
}
#postList {
  padding: 5px;
}
</style>
